@include('admin.header')
  <body class="layui-anim layui-anim-up">
    <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="/admin/welcome">首页</a>
        <a href="">分类管理</a>
        <a>
          <cite>分类列表</cite></a>
      </span>
      <a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:38px">ဂ</i></a>
    </div>
    <div class="x-body">
      <div class="layui-row">
        <form class="layui-form layui-col-md12 x-so">
          <input class="layui-input" placeholder="开始日" name="start" id="start" autocomplete="off">
          <input class="layui-input" placeholder="截止日" name="end" id="end" autocomplete="off">
          <input type="text" name="classify_name"  placeholder="请输入分类名称" autocomplete="off" class="layui-input">
          <button class="layui-btn"  lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
        </form>
      </div>
      <xblock>
        <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
        <button class="layui-btn" onclick="x_admin_show('添加分类','/admin/add_classify')"><i class="layui-icon"></i>添加</button>
        <span class="x-right" id="count" style="line-height:40px">共有分类：{{$count}} 种</span>
      </xblock>
      <div class="list">
        <div class="layui-form">
          <table class="layui-table">
            <thead>
              <tr>
                <th>
                  <input type="checkbox" name="all" value="" lay-skin="primary" lay-filter="all" />
                </th>
                <th>分类名称</th>
                <th>分类排序</th>
                <th>添加时间</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody>
              @foreach($classify as $value)
              <tr>
                <td>
                  <input type="checkbox" name="id[]" value="{{$value->classify_id}}" lay-skin="primary" lay-filter="item" />
                </td>
                <td>{{$value->classify_name}}</td>
                <td>{{$value->classify_ord}}</td>
                <td>{{$value->classify_addtime}}</td>
                <td class="td-manage">
                  <!-- <a title="编辑" class="layui-btn layui-btn-sm layui-btn-normal"  onclick="x_admin_show('编辑','member-edit.html',600,400)" href="javascript:;">
                    编辑
                  </a>
                  <a title="删除" class="layui-btn layui-btn-sm layui-btn-danger" onclick="member_del(this,'{{$value->classify_id}}')" href="javascript:;">
                    删除
                  </a> -->
                  <a title="编辑"  onclick="x_admin_show('编辑','/admin/edit_classify?classify_id={{$value->classify_id}}')" href="javascript:;">
                        <i class="layui-icon">&#xe63c;</i>
                    </a>
                    <a title="删除" onclick="member_del(this,'{{$value->classify_id}}')" href="javascript:;">
                        <i class="layui-icon">&#xe640;</i>
                    </a>
                </td>
              </tr>
              @endforeach
            </tbody>
          </table>
          <div class="page">
            <div>
              {{$classify_p->links()}}
            </div>
          </div>
        </div>
      </div>

    </div>
    <div class="alert">
      提示信息
    </div>
    <style>
      .alert{
        position: fixed;
        width: 280px;
        height: 50px;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        z-index: 9999;
        color: #fff;
        text-align: center;
        line-height: 50px;
        font-size: 16px;
        display: none;
      }
    </style>
    <script>
    
    var classify_name = "";
    var start = "";
    var end = "";
    function searchItem(){
      var str = "";
      if (classify_name!="") {
        str += classify_name;
      }
      if (start!="") {
        str += start;
      }
      if (end!="") {
        str += end;
      }
      return str;
    }
    //提示功能
    function myAlert(msg) {
      $(".alert").html(msg).css({"background-color":"#41b314bb","border-color":"#3ca512bb"}).stop().fadeIn(500);
        setTimeout(function () {
          $(".alert").fadeOut(500);
      },2000)
    }
    //重置分页的样式
    function resetpage(){
      //把span标签改成a标签
      var spans = $('.page-item span');
      for (let i = 0; i < spans.length; i++) {
        spans[i].outerHTML="<a href=''>"+spans[i].innerHTML+"</a>";
      }
      var arr = $(".page-item a");
      for (let i = 0; i < arr.length; i++) {
        if (arr[i].innerHTML=="‹") {
          arr[i].className = "prev";
        }else if(arr[i].innerHTML=="›"){
          arr[i].className = "next";
        }
      }
      //将当前页设置为active
      $(".active a").attr("class","num active");
      //把li 上面的active 去除
      $("li.active").removeClass("active");
      //给页码a标签换类名
      $(".page-item .page-link").attr("class","num");
    }
    resetpage();
    //请求接口获取某一页的数据
    function getGoodData(page,form,getstr=""){
        $.ajax({
            type:"get",
            url:"{{url('/admin/toget_classify_list')}}",
            data:"page="+page+getstr,
            dataType:"html",
            success:function(res){
              $(".list").html(res);
              resetpage();
              form.render();
            }
        })
      // }
    }
    //请求接口获取所有数据的条数
    function getCount(getstr=""){
      $.ajax({
          type:"get",
          url:"{{url('/admin/toget_classify_count')}}",
          data:"p=1"+getstr,
          dataType:"text",
          success:function(res){
            $("#count").html("共有分类："+res+" 种");
          }
      })
    }
    layui.use(['laydate','form'], function(){
      var laydate = layui.laydate;
      var form = layui.form;
      
      //执行一个laydate实例
      laydate.render({
        elem: '#start' //指定元素
      });

      //执行一个laydate实例
      laydate.render({
        elem: '#end' //指定元素
      });

      //搜索功能
      form.on("submit(sreach)",function (data) {
        // console.log(data.field);
        var data_obj = data.field;
        if (data_obj["start"]!="") {
          start = "&start="+data_obj["start"];
        }else{
          start = "";
        }
        if (data_obj["end"]!="") {
          end = "&end="+data_obj["end"];
        }else{
          end = "";
        }
        if (data_obj["classify_name"]!="") {
          classify_name = "&classify_name="+data_obj["classify_name"];
        }else{
          classify_name = "";
        }
        var getstr = searchItem();
        $.ajax({
            type:"get",
            url:"{{url('/admin/toget_classify_list')}}",
            data:"page=1"+getstr,
            dataType:"html",
            success:function(res){
              $(".list").html(res);
              resetpage();
              getCount(getstr);
              form.render();
            }
        })
        return false;
      })
      //点击页码请求接口
      $(document).on("click",".num",function () {
        var page = $(this).html();
        // console.log(page);
        let condition = searchItem();
        getGoodData(page,form,condition);
        return false;
      })
      //点击上一页请求接口
      $(document).on("click",".prev",function () {
        var isdisable = $(this).parent(".disabled").length;
        var cur = $(".page-item").find(".active").html();
        if (isdisable) {
          $(".alert").html("这是梦开始的地方").css({"background-color":"#41b314bb","border-color":"#3ca512bb"}).stop().fadeIn(500);
              setTimeout(function () {
                $(".alert").fadeOut(500);
            },2000)
        }else{
          var page = parseInt(cur)-1
          let condition = searchItem();
          getGoodData(page,form,condition);
        }
        return false;
      })
      //点击下一页请求接口
      $(document).on("click",".next",function () {
        var isdisable = $(this).parent(".disabled").length;
        var cur = $(".page-item").find(".active").html();
        if (isdisable) {
          $(".alert").html("这里的故事等你来续写").css({"background-color":"#41b314bb","border-color":"#3ca512bb"}).stop().fadeIn(500);
          setTimeout(function () {
            $(".alert").fadeOut(500);
          },2000)
        }else{
          var page = parseInt(cur)+1
          let condition = searchItem();
          getGoodData(page,form,condition);
        }
        return false;
      })
      //全选功能
      form.on('checkbox(all)',function(data){
        var arr = $("input[name='id[]']");
        for (let i = 0; i < arr.length; i++) {
          arr.get(i).checked = data.elem.checked;
        }
        form.render('checkbox');
        // console.log(data.elem.checked=false);
      })
      form.on('checkbox(item)',function(data){
        var alllength = $("input[name='id[]']").length;
        var checkedlength = $("input[name='id[]']:checked").length;
        if (alllength==checkedlength) {
          $("input[name='all']").prop("checked", true);
        }else{
          $("input[name='all']").prop("checked", false);
        }
        form.render('checkbox');
        // console.log(data.elem.checked=false);
      })
    });

    /*商品分类-删除*/
    function member_del(obj,id){
      layer.confirm('确认要删除吗？',function(index){
        // console.log(id);
          //发异步删除数据
          $.ajax({
            type:'get',
            url:"{{url('/admin/todo_delclassify')}}",
            data:'classify_id='+id,
            dataType:'json',
            success:function(res){
              if (res.code==1) {
                getGoodData(1,window.layui.form);
                getCount();
                layer.msg(res.msg,{icon:1,time:1000});
              }else{
                layer.msg(res.msg,{icon:1,time:1000});
              }
            }
        })
      });
    }



    function delAll (argument) {
      var arr = $("input[name='id[]']");
      var data = new Array();
      for (let i = 0; i < arr.length; i++) {
          if (arr.get(i).checked==true) {
            data.push(arr.get(i).value);
          }
      }
      console.log(data);
      layer.confirm('确认要删除吗？',function(){
        //捉到所有被选中的，发异步进行删除
        $.ajax({
          type:"post",
          url:"{{url('/admin/todo_delclassifys')}}",
          data: {id:data},
          dataType:"json",
          success:function(res){
            console.log(res);
            if (res.code==1) {
              getGoodData(1,window.layui.form);
              getCount();
              layer.msg(res.msg,{icon:1,time:1000});
            }else{
              layer.msg(res.msg,{icon:1,time:1000});
            }
          }
        })
      });
    }
    </script>
  </body>

</html>